<template>
  <div class="scroll-wrapper" ref='wrapper'>
      <div class="scroll-content">

           <no-data-tip
             v-if="!data.status && data.status !== 0" 
             text='暂无搜索结果' 
            />

           <div v-if="data.status === 0">
               <no-data-tip 
                  v-show="
                    (!data.viewDatas || data.viewDatas.length <=0 ) && 
                    (!data.foodDatas || data.foodDatas.length <=0 ) && 
                    (!data.hotelDatas || data.hotelDatas.length <=0 ) && 
                    (!data.massageDatas || data.massageDatas.length <=0 ) && 
                    (!data.ktvDatas || data.ktvDatas.length <=0 )
                  "
                  text="没有搜索到相关结果"
                />

                <div v-if="data.viewDatas && data.viewDatas.length > 0">
                    <home-title title="景点结果：" />
                    <view-list :viewDatas="data.viewDatas" />
                </div>

                <div v-if="data.foodDatas && data.foodDatas.length > 0">
                    <home-title title="美食结果：" />
                    <food-list :foodDatas="data.foodDatas" />
                </div>

                <div v-if="data.hotelDatas && data.hotelDatas.length > 0">
                    <home-title title="酒店结果：" />
                    <hotel-list :hotelDatas="data.hotelDatas" />
                </div>

                <div v-if="data.massageDatas && data.massageDatas.length > 0">
                    <home-title title="按摩结果：" />
                    <massage-list :massageDatas="data.massageDatas" />
                </div>

                <div v-if="data.ktvDatas && data.ktvDatas.length > 0">
                    <home-title title="KTV结果：" />
                    <ktv-list :ktvDatas="data.ktvDatas" />
                </div>
           </div>

           <error :errorShow="data.status === -1" />

      </div>
  </div>
</template>

<script>
import BetterScroll from 'better-scroll';

import HomeTitle from './Sub/HomeTitle';
import ViewList from "./ViewList";
import FoodList from "./FoodList";
import HotelList from "./HotelList";
import MassageList from "./MassageList";
import KtvList from "./KtvList";
import NoDataTip from './Sub/NoDataTip';
import Error from './Sub/Error';

export default {
  name: 'SearchScrollWrapper',
  components: {
    HomeTitle,
    ViewList,
    FoodList,
    HotelList,
    MassageList,
    KtvList,   
    NoDataTip,
    Error
  },
  props: {
      data: Object
  },
  mounted () {
      this.scroll = new BetterScroll(this.$refs.wrapper, {
          mouseWheel: true,
          // preventDefault: false,
          click: true,
          tap: true
      });
  },
  watch: {
       data () {
           console.log(this.data);
       }
  }
}
</script>

<style lang="scss" scoped>

</style>